<template>
	<view class="w-[100%]  relative">
        <!-- <image src="@/static/images/index_bg/bg_index.png" class="w-[100%] h-[396rpx] z-[-1] absolute top-0"></image> -->
        
        <!-- 消息列表 -->
        <!-- <z-paging 
            :empty-view-error-text="`对不起,页面走丢了\n请刷新试试`" 
            :empty-view-text="`暂无消息`" 
            empty-view-center 
            ref="paging" 
            v-model="messageList"
            @query="queryList" 
            :fixed="true" 
            width="100%" 
            height="100%"> -->
            <!-- <template #top>
                <up-navbar title="" :autoBack="false" placeholder bgColor="rgba(255,255,255,0)">
            <template #left>
                <text class="text-[34rpx] text-[#000] font-[500]">消息</text>
            </template>
        </up-navbar>
            </template> -->
            <view class="px-[40rpx] pt-[56rpx]">
                <view 
                    v-for="(message, index) in messageList" 
                    :key="message.id" 
                    class="flex h-[136rpx] bg-[#FFFFFF] rounded-[24rpx] items-center pl-[28rpx] mb-[24rpx]">
                    <view>
                        <image src="@/static/images/img/jcdd.png" class="w-[92rpx] h-[92rpx]" style="border-radius: 50%;"></image>
                    </view>
                    <view class="ml-[22rpx]">
                        <view class="text-[#000000] font-[ PingFang SC] text-[28rpx] font-[500]">{{ message.title || '系统消息' }}</view>
                        <view class="mt-[8rpx] text-[24rpx] font-[ PingFang SC] text-[#999999] font-normal">{{ message.createTime || '' }}</view>
                    </view>
                </view>
            </view>
        <!-- </z-paging> -->
	</view>
    
</template>

<script setup>
import { ref } from 'vue';

import { onShow } from '@dcloudio/uni-app';
import useUserStore from '@/store/modules/user';

const userStore = useUserStore();
const messageList = ref([
    {
        id: 1,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    },
    {
        id: 2,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    },
    {
        id: 3,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    },
    {
        id: 4,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    },
    {
        id: 5,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    },
    {
        id: 6,
        title: '您的评论涉嫌违规，已被删除',
        createTime: '2020-01-10 12:23:12'
    }
]);
const paging = ref(null);

// 获取消息列表数据
// const queryList = async (pageNum, pageSize) => {
//     try {
//         // 模拟API调用延迟
//         await new Promise(resolve => setTimeout(resolve, 500));
        
//         // 模拟分页数据
//         const startIndex = (pageNum - 1) * pageSize;
//         const endIndex = startIndex + pageSize;
//         const pageData = messageList.value.slice(startIndex, endIndex);
        
//         paging.value.complete(pageData);
//     } catch (e) {
//         console.log('获取消息列表失败:', e);
//         paging.value.complete(false);
//     }
// };

// 刷新页面数据
onShow(() => {
    // 每次页面显示时刷新数据
    if (paging.value) {
        paging.value.reload();
    }
});
</script>

<style scoped lang="scss">
</style>